<template>
  <div class="list-table" :style="{ height: height }">
    <div class=" area-header">
      <span class="area-header-title">
        {{ $t('文档库及文件初始化') }}
        <el-popover
          placement="right"
          width="400"
          trigger="click"
        >
          <span style="font-weight: bold;">{{ $t('上传目录结构示意图') }}</span>
          <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
          <el-icon slot="reference" class="el-icon-question" />
        </el-popover>
      </span>
    </div>
    <div>
      <template>
        <el-radio v-model="radio" label="TG">{{ $t('文件存在时跳过') }}</el-radio>
        <el-radio v-model="radio" label="FG">{{ $t('文件存在时覆盖') }}</el-radio>
        <el-checkbox v-model="autoCreate" true-label="true" false-label="false">
          {{ $t('目录不存在时自动创建') }}
          <el-tooltip :content="$t('该功能对项目基金等关联附件导入功能无效')" placement="top">
            <i class="el-icon-question" />
          </el-tooltip>
        </el-checkbox>
      </template>
      <el-button v-hasPermi="['init:init:edit']" @click="uploadFolderOpens">{{ $t('选择文件夹') }}</el-button>
      <el-dialog v-el-drag-dialog :title="$t('文件夹上传') + ' - ' + (radio === 'TG' ? $t('跳过') : $t('覆盖'))" :visible.sync="uploadFolderOpen" :close-on-click-modal="false" :destroy-on-close="true" width="70%" append-to-body>
        <folder ref="folder" :file-check="radio" :auto-create="autoCreate" />
      </el-dialog>
    </div>
  </div>
</template>
<script>
import folder from '@/views/system/initData/file/initFile.vue'
export default {
  components: {
    folder
  },
  props: {
    // 高度
    height: {
      type: String,
      required: true,
      default: '200px'
    }
  },
  data() {
    return {
      // 遮罩层
      loading: false,
      data: [{
        label: this.$t('根目录'),
        children: [
          {
            label: this.$t('公司文档'),
            children: [
              {
                label: this.$t('公司模板'),
                children: [
                  {
                    label: this.$t('项目模板'),
                    children: [{
                      label: this.$t('附件.......')
                    }]
                  },
                  {
                    label: this.$t('基金模板'),
                    children: [{
                      label: this.$t('附件.......')
                    }]
                  }
                ]
              }
            ]
          },
          {
            label: this.$t('股权项目'),
            children: [
              {
                label: this.$t('XXX项目名称'),
                children: [
                  {
                    label: this.$t('项目类型(立项, 尽调....)'),
                    children: [{
                      label: this.$t('附件.......')
                    }]
                  }
                ]
              },
              {
                label: this.$t('以此类推......')
              }
            ]
          },
          {
            label: this.$t('债权项目'),
            children: [{
              label: this.$t('(参考股权项目目录结构)')
            }]
          },
          {
            label: this.$t('参股基金'),
            children: [{
              label: this.$t('(参考股权项目目录结构)')
            }]
          },
          {
            label: this.$t('基金文档'),
            children: [
              {
                label: this.$t('XXX基金名称'),
                children: [
                  {
                    label: this.$t('基金类型'),
                    children: [{
                      label: this.$t('附件.......')
                    }]
                  }
                ]
              }, {
                label: this.$t('以此类推......')
              }
            ]
          },
          {
            label: this.$t('SPV文档'),
            children: [
              {
                label: this.$t('SPV类型'),
                children: [{
                  label: this.$t('参考基金文档')
                }]
              }
            ]
          }
        ]
      }],
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      uploadFolderOpen: false,
      radio: 'TG',
      autoCreate: 'false'
    }
  },
  created() {},
  mounted() {},
  methods: {
    handleNodeClick(data) {
      console.log(data)
    },
    uploadFolderOpens() {
      this.uploadFolderOpen = true
      this.$nextTick(() => {
        this.$refs.folder.showSuccessFileText = ''
        this.$refs.folder.showErrorFileText = ''
        this.$refs.folder.fileList = []
      })
    }
  }
}
</script>

<style scoped>

</style>
